<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<title>Stock Watcher</title>

<link rel="stylesheet" type="text/css" media="screen"
	href="css/smoothness/jquery-ui-1.8.12.custom.css" />
<link rel="stylesheet" type="text/css" media="screen"
	href="css/smoothness/ui.jqgrid.css" />
<script src="js/jquery-1.5.2.min.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="js/grid.addons.js" type="text/javascript"></script>
<script type="text/javascript">

			var brokerURL = 'http://localhost:9090/proxy_broker/rest/index';
		
			function createStockTable(tableHeader) {
				jQuery("#stockTable").jqGrid({
					datatype: "local",
					height: 400, 
					colNames:['Index Name', 'Current Value','Maximum Value', 'Minimum Value', 'Opening Value','Reference Value','Sales Volume', 'Update Time'], 
					colModel:[ 
					          {name:'name',index:'name', width:120},
					          {name:'currentValue',index:'currentValue', width:120, sorttype:"float"},
					          {name:'maxValue',index:'maxValue', width:120, sorttype:"float"},
					          {name:'minValue',index:'minValue', width:120, sorttype:"float"},
					          {name:'openingValue',index:'openingValue', width:120, sorttype:"float"},
					          {name:'referenceValue',index:'referenceValue', width:120, sorttype:"float"},
					          {name:'salesVolume',index:'salesVolume', width:120, sorttype:"float"},
					          {name:'time',index:'time', width:150, sortable:false}				
					          ],
		          sortname: 'name', 
		          viewrecords: true,
		          sortorder: "desc",
				  caption:tableHeader
				});
			}
				
			function destroyTable() {
				$('#stockTable').jqGrid('GridUnload');
			}

			function initTable(header) {
				$.getJSON(brokerURL, function(data) {
					if(data) {
						if(data.valors[0].currentValue != 0) {
							destroyTable();
							createStockTable(header);
							for(var i=0;i<=data.valors.length;i++) { 
								jQuery("#stockTable").jqGrid('addRowData',i+1,data.valors[i]);
							}
						}
					}
				});
			}
			
			function updateTableContent() {
				$.getJSON(brokerURL, function(data) {
					if(data) {
						if(data.valors[0].currentValue != 0) {
							for(var i=0;i<=data.valors.length;i++) { 
								if(data.valors[i] && data.valors[i].currentValue != 0) {
									jQuery("#stockTable").jqGrid('setRowData',i+1,data.valors[i]);
								}
							}								
						}
					}
				});
			}
			
		</script>
</head>

<body>
<table id="stockTable"></table>

<script type="text/javascript">
			jQuery(document).ready(function() {
				$.getJSON(brokerURL, function(data) {
					if(data) {
						if(data.valors[0].currentValue != 0) {
							destroyTable();
							createStockTable('WIG-SPOZYW');
							for(var i=0;i<=data.valors.length;i++) { 
								jQuery("#stockTable").jqGrid('addRowData',i+1,data.valors[i]);
							}
						}
					}
				});
				initTable('WIG-SPOZYW');
				setInterval(updateTableContent, 5000);					
			});
			</script>
</body>
</html>
